import { initMixin } from './init.js'
import { lifecircleMixin } from './lifecircle.js'
import { renderMixin } from './vdom/index.js'
import { initGlobalApi } from './global-api/index.js'
import { stateMixin } from './state.js'
function Vue(options) {
    // 初始化
    this._init(options)
}

// 原型方法  prototype
initMixin(Vue);  //_init
lifecircleMixin(Vue);  //_update
renderMixin(Vue)  // _render

// 静态方法  Vue.component  Vue.directive Vue.mixin Vue.extend
initGlobalApi(Vue)
stateMixin(Vue)


// import { compileToFunction } from './compiler/index.js'
// import { parseDom, dispatch } from './vdom/dispatch'

// const vm1 = new Vue({ data: { name: 'zf' } });
// const render1 = compileToFunction(`
//     <div>
//     <li style="background:red" key="A"> A </li>
//     <li style="background:yellow" key="B"> B </li>
//     <li style="background:pink" key="C"> C </li>
//     <li style="background:green" key="D"> D </li>
//     </div>
// `)
// const vnode1 = render1.call(vm1)
// console.log(vnode1);
// document.body.appendChild(parseDom(vnode1))

// const vm2 = new Vue({ data: { name: 'jw' } });
// const render2 = compileToFunction(`
//     <div>
//     <li style="background:green" key="D"> D </li>
//     <li style="background:#bfa" key="B"> F </li>
//     <li style="background:pink" key="C"> C </li>
//     <li style="background:green" key="A"> A </li>
//     </div>
// `)

// const vnode2 = render2.call(vm2)

// setTimeout(() => {
//     dispatch(vnode2, vnode1)
// }, 5000)


export default Vue